<?php

use yii\helpers\Url;

$this->title = '贷款部初审申请表';
?>
    <style>
        .site-block {
            padding: 20px;
            border: 1px solid #eee;
        }

        .site-title {
            margin: 30px 0 20px;
        }

        .site-title fieldset {
            border: none;
            padding: 0;
            border-top: 1px solid #eee;
        }

        .site-title fieldset legend {
            margin-left: 20px;
            padding: 0 10px;
            font-size: 22px;
            font-weight: 300;
        }

        .layui-form-label {
            text-align: left
        }
        .image-content  img{width:80%}
        .text.text-danger{color:red;}
    </style>
    <ul class="layui-nav" style="text-align:center">
        <li class="layui-nav-item">贷款部初审申请表</li>
    </ul>
    <div class="layui-container">
        <form class="layui-form" method="post">
            <input type="hidden" name="sale_id" value="<?= $sale_id ?>">
            <input type="hidden" name="card_front" id="card-front-input">
            <input type="hidden" name="card_back" id="card-back-input">
            <input type="hidden" value="<?= Yii::$app->request->csrfToken; ?>" name="_csrf-frontend">
            <div class="site-title">
                <fieldset>
                    <legend><a name="use">一、个人信息</a></legend>
                </fieldset>
            </div>
            <div class="site-text site-block">

                <div class="layui-form-item">
                    <label class="layui-form-label"><span class="text text-danger">*</span>姓名</label>
                    <div class="layui-input-block">
                        <input type="text" name="name" required="" lay-verify="required" placeholder="请填写姓名"
                               autocomplete="off" class="layui-input">
                    </div>
                </div>
                <div class="layui-form-item">
                    <label class="layui-form-label"><span class="text text-danger">*</span>身份证号码</label>
                    <div class="layui-input-block">
                        <input type="text" name="id_no" required="" lay-verify="required" placeholder="请填写身份证"
                               autocomplete="off" class="layui-input">
                    </div>
                </div>
                <div class="layui-form-item">
                    <label class="layui-form-label"><span class="text text-danger">*</span>实名手机号</label>
                    <div class="layui-input-block">
                        <input type="text" name="mobile" required="" lay-verify="required" placeholder="请填写手机"
                               autocomplete="off" class="layui-input">
                    </div>
                </div>
                <div class="layui-form-item">
                    <label class="layui-form-label"><span class="text text-danger">*</span>服务密码</label>
                    <div class="layui-input-block">
                        <input type="password" name="mobile_pass" required="" lay-verify="required"
                               placeholder="手机号服务密码(移动联通电信)" autocomplete="off" class="layui-input">
                    </div>
                </div>
                <div class="layui-form-item">
                    <label class="layui-form-label"><span class="text text-danger">*</span>婚姻状况</label>
                    <div class="layui-input-block">
                        <input type="text" name="is_marry" required="" lay-verify="required" placeholder="请填写婚姻状况"
                               autocomplete="off" class="layui-input">
                    </div>
                </div>
                <div class="layui-form-item">
                    <label class="layui-form-label">属相</label>
                    <div class="layui-input-block">
                        <input type="text" name="animal_zodiac" placeholder="请填写属相" autocomplete="off"
                               class="layui-input">
                    </div>
                </div>
                <div class="layui-form-item">
                    <label class="layui-form-label"><span class="text text-danger">*</span>学历</label>
                    <div class="layui-input-block">
                        <input type="text" name="education_background" required="" lay-verify="required"
                               placeholder="请填写学历" autocomplete="off" class="layui-input">
                    </div>
                </div>
                <div class="layui-form-item">
                    <label class="layui-form-label"><span class="text text-danger">*</span>现住宅地址</label>
                    <div class="layui-input-block">
                        <input type="text" name="home_address" required="" lay-verify="required" placeholder="请填写住宅地址"
                               autocomplete="off" class="layui-input">
                    </div>
                </div>
                <div class="layui-form-item">
                    <label class="layui-form-label"><span class="text text-danger">*</span>公司全称</label>
                    <div class="layui-input-block">
                        <input type="text" name="company_name" required="" lay-verify="required" placeholder="请填写公司名称"
                               autocomplete="off" class="layui-input">
                    </div>
                </div>
                <div class="layui-form-item">
                    <label class="layui-form-label"><span class="text text-danger">*</span>公司详细地址</label>
                    <div class="layui-input-block">
                        <input type="text" name="company_address" required="" lay-verify="required"
                               placeholder="公司详细地址" autocomplete="off" class="layui-input">
                    </div>
                </div>
                <div class="layui-form-item">
                    <label class="layui-form-label"><span class="text text-danger">*</span>公司电话</label>
                    <div class="layui-input-block">
                        <input type="text" name="company_tel" required="" lay-verify="required" placeholder="请填写公司电话"
                               autocomplete="off" class="layui-input">
                    </div>
                </div>
                <div class="layui-form-item">
                    <label class="layui-form-label"><span class="text text-danger">*</span>入职时间</label>
                    <div class="layui-input-block">
                        <input type="text" name="entry_time" required="" lay-verify="required" id="entry_time"
                               placeholder="请选择入职时间" autocomplete="off" class="layui-input">
                    </div>
                </div>
            </div>


            <div class="site-title">
                <fieldset>
                    <legend><a name="use">二、资产信息</a></legend>
                </fieldset>
            </div>
            <div class="site-text site-block">
                <div class="layui-form-item">
                    <label class="layui-form-label">信用卡1</label>
                    <div class="layui-input-block">
                        <input type="text" name="card1" placeholder="请填写卡号" autocomplete="off" class="layui-input">
                    </div>
                </div>
                <div class="layui-form-item">
                    <label class="layui-form-label">额度</label>
                    <div class="layui-input-block">
                        <input type="text" name="card1_limit" placeholder="请填写额度" autocomplete="off"
                               class="layui-input">
                    </div>
                </div>
                <div class="layui-form-item">
                    <label class="layui-form-label">信用卡2</label>
                    <div class="layui-input-block">
                        <input type="text" name="card2" placeholder="请填写卡号" autocomplete="off" class="layui-input">
                    </div>
                </div>
                <div class="layui-form-item">
                    <label class="layui-form-label">额度</label>
                    <div class="layui-input-block">
                        <input type="text" name="card2_limit" placeholder="请填写额度" autocomplete="off"
                               class="layui-input">
                    </div>
                </div>
                <div class="layui-form-item">
                    <label class="layui-form-label">信用卡3</label>
                    <div class="layui-input-block">
                        <input type="text" name="card3" placeholder="请填写卡号" autocomplete="off" class="layui-input">
                    </div>
                </div>
                <div class="layui-form-item">
                    <label class="layui-form-label">额度</label>
                    <div class="layui-input-block">
                        <input type="text" name="card3_limit" placeholder="请填写额度" autocomplete="off"
                               class="layui-input">
                    </div>
                </div>
                <div class="layui-form-item">
                    <label class="layui-form-label">信用卡账单邮箱</label>
                    <div class="layui-input-block">
                        <input type="text" name="credit_email" placeholder="信用卡账单邮箱号"
                               autocomplete="off"
                               class="layui-input">
                    </div>
                </div>
                <div class="layui-form-item">
                    <label class="layui-form-label">密码</label>
                    <div class="layui-input-block">
                        <input type="password" name="credit_email_pass"
                               placeholder="请填写邮箱密码" autocomplete="off"
                               class="layui-input">
                    </div>
                </div>
                <div class="layui-form-item">
                    <label class="layui-form-label">芝麻分</label>
                    <div class="layui-input-block">
                        <input type="number" name="zhima_score" placeholder="请填写芝麻分" autocomplete="off"
                               class="layui-input">
                    </div>
                </div>
                <div class="layui-form-item">
                    <label class="layui-form-label">社保卡号</label>
                    <div class="layui-input-block">
                        <input type="text" name="social_security" placeholder="请填写社保卡号" autocomplete="off"
                               class="layui-input">
                    </div>
                </div>
                <div class="layui-form-item">
                    <label class="layui-form-label">公积金卡号</label>
                    <div class="layui-input-block">
                        <input type="text" name="provident_fund" placeholder="请填写公积金卡号" autocomplete="off"
                               class="layui-input">
                    </div>
                </div>
                <div class="layui-form-item">
                    <label class="layui-form-label"><span class="text text-danger">*</span>QQ号</label>
                    <div class="layui-input-block">
                        <input type="text" name="qq" required="" lay-verify="required" placeholder="请填写QQ"
                               autocomplete="off" class="layui-input">
                    </div>
                </div>
                <div class="layui-form-item">
                    <label class="layui-form-label"><span class="text text-danger">*</span>微信号</label>
                    <div class="layui-input-block">
                        <input type="text" name="wechat" required="" lay-verify="required" placeholder="请填写微信号"
                               autocomplete="off" class="layui-input">
                    </div>
                </div>
            </div>

            <div class="site-title">
                <fieldset>
                    <legend><a name="use">三、联系人信息</a></legend>
                </fieldset>
            </div>
            <div class="site-text site-block">
                <div class="layui-form-item">
                    <label class="layui-form-label"><span class="text text-danger">*</span>父母</label>
                    <div class="layui-input-block">
                        <input type="text" name="parents_name" required="" lay-verify="required" placeholder="请填写父母姓名"
                               autocomplete="off" class="layui-input">
                    </div>
                </div>
                <div class="layui-form-item">
                    <label class="layui-form-label"><span class="text text-danger">*</span>手机</label>
                    <div class="layui-input-block">
                        <input type="text" name="parents_mobile" required="" lay-verify="required" placeholder="请填写父母手机"
                               autocomplete="off" class="layui-input">
                    </div>
                </div>
                <div class="layui-form-item">
                    <label class="layui-form-label">配偶</label>
                    <div class="layui-input-block">
                        <input type="text" name="spouse_name" placeholder="请填写配偶姓名" autocomplete="off"
                               class="layui-input">
                    </div>
                </div>
                <div class="layui-form-item">
                    <label class="layui-form-label">手机</label>
                    <div class="layui-input-block">
                        <input type="text" name="spouse_mobile" placeholder="请填写配偶手机" autocomplete="off"
                               class="layui-input">
                    </div>
                </div>
                <div class="layui-form-item">
                    <label class="layui-form-label">朋友</label>
                    <div class="layui-input-block">
                        <input type="text" name="friend_name" placeholder="请填写朋友姓名" autocomplete="off"
                               class="layui-input">
                    </div>
                </div>
                <div class="layui-form-item">
                    <label class="layui-form-label">手机</label>
                    <div class="layui-input-block">
                        <input type="text" name="friend_mobile" placeholder="请填写朋友手机" autocomplete="off"
                               class="layui-input">
                    </div>
                </div>
                <div class="layui-form-item">
                    <label class="layui-form-label">同事</label>
                    <div class="layui-input-block">
                        <input type="text" name="colleague_name" placeholder="请填写同事姓名" autocomplete="off"
                               class="layui-input">
                    </div>
                </div>
                <div class="layui-form-item">
                    <label class="layui-form-label">手机</label>
                    <div class="layui-input-block">
                        <input type="text" name="colleague_mobile" placeholder="请填写同事手机" autocomplete="off"
                               class="layui-input">
                    </div>
                </div>

            </div>

            <div class="site-title">
                <fieldset>
                    <legend><a name="use">四、收款账号</a></legend>
                </fieldset>
            </div>
            <div class="site-text site-block">
                <div class="layui-form-item">
                    <label class="layui-form-label"><span class="text text-danger">*</span>银行名称</label>
                    <div class="layui-input-block">
                        <input type="text" name="bank_name" required="" lay-verify="required" placeholder="请填写银行名称"
                               autocomplete="off" class="layui-input">
                    </div>
                </div>
                <div class="layui-form-item">
                    <label class="layui-form-label"><span class="text text-danger">*</span>银行卡号</label>
                    <div class="layui-input-block">
                        <input type="text" name="bank_no" required="" lay-verify="required" placeholder="请填写银行卡号"
                               autocomplete="off" class="layui-input">
                    </div>
                </div>
            </div>
            <input type="file" name="UploadForm[imageFile]" class="upload-input" style="display:none">
            <div class="site-text site-block">
                <div class="layui-form-item">
                    <button type="button" class="layui-btn uploader" id="card-front">
                        <i class="layui-icon">&#xe67c;</i>上传身份证正面
                    </button>
                    <div class="image-content" id="card-front-preview"></div>
                </div>
                <div class="layui-form-item">
                    <button type="button" class="layui-btn uploader" id="card-back">
                        <i class="layui-icon">&#xe67c;</i>上传身份证反面
                    </button>
                    <div class="image-content" id="card-back-preview"></div>
                </div>
            </div>

            <button class="layui-btn layui-btn-lg" style="width:100%;margin-top:1rem;" layui-submit type="submit">提交
            </button>
        </form>
    </div>
    <script>

    </script>
<?php $this->registerJs("
        layui.use(['laydate', 'form', 'layer', 'upload'], function(){
            var laydate = layui.laydate, form = layui.form, layer = layui.layer, upload = layui.upload;
            $('.uploader').each(function(){
                var id = $(this).attr('id');
                upload.render({
                    elem: '#'+id //绑定元素
                    ,field: 'UploadForm[imageFile]' //绑定元素
                    // ,auto:false
                    // ,bindAction: '.uploader-trigger'
                    ,data:{'" . Yii::$app->request->csrfParam . "':'" . Yii::$app->request->csrfToken . "'}
                    ,url: '" . Url::to(['/index/upload']) . "' //上传接口
                    ,before: function(obj){ //obj参数包含的信息，跟 choose回调完全一致，可参见上文。
                        obj.preview(function(index, file, result){
                            $('#'+id+'-preview').html('<img src=\"'+result+'\">');
                        });
                        layer.load(); //上传loading
                    }
                    ,choose: function(obj){
                        //将每次选择的文件追加到文件队列
                        var files = obj.pushFile();
                        console.log(files);
                        //预读本地文件，如果是多文件，则会遍历。(不支持ie8/9)
                        obj.preview(function(index, file, result){
                            console.log(index); //得到文件索引
                            console.log(file); //得到文件对象
                            console.log(result); //得到文件base64编码，比如图片
                            
                            //obj.resetFile(index, file, '123.jpg'); //重命名文件名，layui 2.3.0 开始新增
                            
                            //这里还可以做一些 append 文件列表 DOM 的操作
                            
                            //obj.upload(index, file); //对上传失败的单个文件重新上传，一般在某个事件中使用
                            //delete files[index]; //删除列表中对应的文件，一般在某个事件中使用
                        });
                    }
                    ,done: function(res){
                        layer.closeAll('loading');
                        layer.msg(res.msg);
                        //上传完毕回调
                        if(res.status === 'SUCCESS') {
                            $('#'+id+'-input').val(res.data.path);
                        }
                    }
                    ,error: function(){
                        //请求异常回调
                    }
                });
            });
            //执行一个laydate实例
            laydate.render({
                elem: '#entry_time' //指定元素
            });
            // 表单提交
            form.on('submit', function(data){
                console.log(data.elem);
                var params = $(data.elem).serialize();
                $.ajax({
                    data:params,
                    type:'post',
                    dataType:'json',
                    success:function(resp){
                        layer.msg(resp.msg);
                    }

                })
                return false;
            })
        });
") ?>